<template>
	<navigator class="goods-item u-p-40 u-m-t-20" :url="`/pages/goods/show?id=${goods.id}`">
		<u-image class="u-skeleton-fillet" width="100%" height="300rpx" :src="goods.cover_url"></u-image>
		<view class="title u-skeleton-rect u-font-16 u-line-1 u-m-t-10 u-m-b-10">
			{{goods.title ? goods.title : '商品名称'}}
		</view>
		<view class="u-flex u-row-between">
			<view class="price u-skeleton-rect u-flex-1 u-m-r-10">￥{{goods.price}}元</view>
			<view class="cales u-skeleton-rect u-flex-1">销量：{{goods.sales}}</view>
		</view>
	</navigator>
</template>

<script>
	export default {
		name: "goods-card",
		props: {
			goods: {
				type: [Object, Number],
				required: true
			}
		},
		data() {
			return {};
		}
	}
</script>

<style scoped>
	.title {
		font-weight: 500;
		width: 100%;
	}

	.price {
		color: red;
	}

	.cales {
		color: #888;
	}
</style>
